<template>
  <div class="content-wraper">
    <div class="search-box">
      <el-form label-width="100px" :inline="true">
        <el-form-item label="项目名称">
          <el-input v-model="projectName" />
        </el-form-item>
        <el-button type="primary" icon="el-icon-search" @click="search()">查询</el-button>
        <el-button type="warning" icon="el-icon-refresh" @click="reset()">重置</el-button>
        <el-button type="success" icon="el-icon-plus" @click="addCompletionDelivery()">新增</el-button>
      </el-form>
    </div>
    <div class="detail">
      <com-table :data="dataList" :columns="columns" :total="total" @pageChange="pageChange">
        <template v-slot:name="{row}">
          <a class="com-link" @click="viewDetail(row)">{{ row.name }}</a>
        </template>
        <template v-slot:options="{row}">
          <el-button type="success" icon="el-icon-edit-outline" size="mini" @click="startProcess(row)">提交</el-button>
          <el-button type="primary" icon="el-icon-edit" size="mini" @click="editCompletionDelivery(row)">编辑</el-button>
          <el-button type="danger" icon="el-icon-delete" size="mini" @click="delCompletionDelivery(row)">删除</el-button>
        </template>
        <template v-slot:financialInfo="{row: {financialInfo}}">
          {{ getDictName(completionDeliveryMoveStatus, financialInfo) }}
        </template>
        <template v-slot:financialMoveTime="{row: {financialMoveTime}}">
          {{ dateFormat(financialMoveTime) }}
        </template>
        <template v-slot:completionInfo="{row: {completionInfo}}">
          {{ getDictName(completionDeliveryMoveStatus, completionInfo) }}
        </template>
        <template v-slot:completionMoveTime="{row: {completionMoveTime}}">
          {{ dateFormat(completionMoveTime) }}
        </template>
        <template v-slot:manageInfo="{row: {manageInfo}}">
          {{ getDictName(completionDeliveryMoveStatus, manageInfo) }}
        </template>
        <template v-slot:manageMoveTime="{row: {manageMoveTime}}">
          {{ dateFormat(manageMoveTime) }}
        </template>
        <template v-slot:problemInfo="{row: {problemInfo}}">
          {{ getDictName(completionDeliveryMoveStatus, problemInfo) }}
        </template>
        <template v-slot:problemMoveTime="{row: {problemMoveTime}}">
          {{ dateFormat(problemMoveTime) }}
        </template>
        <template v-slot:status="{row}">
          <a class="com-link" style="text-decoration:underline;" @click="getWorkflowDetail(row)">{{ row.status | formateFlowStatus }}</a>
        </template>
        <template v-slot:createTime="{row: {createTime}}">
          {{ dateFormat(createTime) }}
        </template>

      </com-table>
    </div>
    <add-completion-delivery
      :show-modal.sync="showModal"
      :opt-type="optType"
      :data="unitDetail"
      @freshList="search"
    />
    <process-start :show-modal.sync="showStartModal" :currentrow="unitDetail" @freshList="search" />
    <workflow-schedule :show-modal.sync="showWorkflowSchedule" :data="workflowScheduleData" />
  </div>
</template>

<script>
import workflowSchedule from '@/components/TreeModal/workflowSchedule'
import { getCompletionDeliveryList, deleteCompletionDelivery } from '@/api/completedManage'
import moment from 'moment'
import addCompletionDelivery from './addCompletionDelivery.vue'
import { completionDeliveryMoveStatus, workflowStatus } from '@/utils/dicData'
import { getDictName } from '@/utils/comm'
export default {
  name: 'CompletionDelivery',
  components: {
    addCompletionDelivery,
    workflowSchedule
  },
  data() {
    return {
      projectName: '',
      getDictName,
      completionDeliveryMoveStatus,
      workflowStatus,
      showStartModal: false,
      dataList: [],
      total: 0,
      pageParams: {
        pageNum: 1,
        pageSize: 10
      },
      showWorkflowSchedule: false,
      workflowScheduleData: {},
      showModal: false,
      optType: 'add',
      unitDetail: {},
      columns: [
        {
          fixed: 'left',
          label: '项目名称',
          prop: 'projectName',
          width: '250'
        },
        {
          label: '财务资料',
          prop: 'financialInfo',
          slot: 'financialInfo'
        },
        /* {
          label: '财务移交时间',
          prop: 'financialMoveTime',
          slot: 'financialMoveTime',
          width: '100'
        },
        {
          label: '财务移交人',
          prop: 'financialTransferor',
          width: '100'
        },
        {
          label: '财务接收人',
          prop: 'financialReceiver',
          width: '100'
        },*/
        {
          label: '竣工资料',
          prop: 'completionInfo',
          slot: 'completionInfo'
        },
        /* {
          label: '竣工移交时间',
          prop: 'completionMoveTime',
          slot: 'completionMoveTime',
          width: '100'
        },
        {
          label: '竣工移交人',
          prop: 'completionTransferor',
          width: '100'
        },
        {
          label: '竣工接收人',
          prop: 'completionReceiver',
          width: '100'
        },*/
        {
          label: '管理资料',
          prop: 'manageInfo',
          slot: 'manageInfo'
        },
        /* {
          label: '管理移交时间',
          prop: 'manageMoveTime',
          slot: 'manageMoveTime',
          width: '100'
        },
        {
          label: '管理移交人',
          prop: 'manageTransferor',
          width: '90'
        },
        {
          label: '管理接收人',
          prop: 'manageReceiver',
          width: '90'
        },*/
        {
          label: '问题资料',
          prop: 'problemInfo',
          slot: 'problemInfo'
        },
        /* {
          label: '问题移交时间',
          prop: 'problemMoveTime',
          slot: 'problemMoveTime',
          width: '100'
        },
        {
          label: '问题移交人',
          prop: 'problemTransferor',
          width: '90'
        },
        {
          label: '问题接收人',
          prop: 'problemReceiver',
          width: '90'
        },*/
        {
          label: '备注',
          prop: 'remark',
          width: '100'
        },
        {
          label: '流程状态',
          prop: 'status',
          slot: 'status'
        },
        {
          label: '编制人',
          prop: 'founderName',
          width: '90'
        },
        {
          label: '编制时间',
          prop: 'createTime',
          slot: 'createTime',
          width: '90'
        },
        {
          fixed: 'right',
          label: '操作',
          width: '260',
          prop: 'options',
          slot: 'options'
        }
      ]
    }
  },
  mounted() {
    this.getDataList()
  },
  methods: {
    getWorkflowDetail(data) {
      this.showWorkflowSchedule = true
      this.workflowScheduleData = data
    },
    startProcess(data) {
      this.unitDetail = data
      this.showStartModal = true
    },
    dateFormat(data) {
      if (data) {
        return moment(data).format('YYYY-MM-DD')
      } else {
        return ''
      }
    },
    pageChange(data) {
      this.pageParams = data
      this.getDataList()
    },
    getDataList() {
      const params = {
        ...this.pageParams,
        projectName: this.projectName
      }
      getCompletionDeliveryList(params).then(res => {
        const { data, total } = res.data || {}
        if (data) {
          this.dataList = data
          this.total = total - 0
        }
      })
    },
    addCompletionDelivery() {
      this.optType = 'add'
      this.showModal = true
    },
    editCompletionDelivery(data) {
      this.optType = 'edit'
      this.unitDetail = data
      this.showModal = true
    },
    viewDetail(data) {
      this.optType = 'detail'
      this.unitDetail = data
      this.showAddFileModal = true
    },
    delCompletionDelivery(data) {
      this.$confirm('确定要删除该单位吗, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        const { id } = data
        deleteCompletionDelivery({
          completionDeliveryId: id
        }).then(res => {
          const { code, msg } = res
          if (code === '0001') {
            this.$message({
              type: 'success',
              message: '删除成功!'
            })
            this.getDataList()
          } else {
            this.$message({
              type: 'error',
              message: msg || '删除失败!'
            })
          }
        })
      }).catch(() => {
      })
    },
    search() {
      this.pageParams.pageNum = 1
      this.getDataList()
    },
    reset() {
      this.projectName = ''
    }

  }
}
</script>

<style lang="scss" scoped>
.search-box {
  height: 50px;
}
.detail{
  height: calc(100% - 50px);
}
</style>
